<template>
  <view class="goods_navbar_com">
    <view class="status_bar"><!-- 这里是状态栏 --></view>
    <view class="navbar">
      <view class="back">
        <view class="icon" @click="back">
          <u-icon name="arrow-left" color="#fff" size="40"></u-icon>
        </view>
      </view>
      <view class="body"></view>
      <view class="more">
        <!-- #ifdef APP -->
        <!-- <view class="icon" @click="shares">
          <u-icon name="share" color="#fff" size="40"></u-icon>
        </view> -->
        <!-- #endif -->
        <!-- <view class="icon" style="margin-left: 20rpx;">
					<u-icon
						name="more-dot-fill"
						color="#fff"
						size="40"
					></u-icon>
				</view> -->
      </view>
    </view>
  </view>
</template>

<script>
import { Base64 } from 'js-base64'
import { getWechatShareImageAction } from '@/api/http/home'
// #ifdef H5
import wx from 'weixin-js-sdk'
// #endif
import storage from '@/util/storage'
export default {
  components: {},
  props: {
    value: {
      type: Object,
      default: () => {}
    },
    change: {
      type: Function,
      default: () => {}
    },
    routerParams: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {}
  },
  created() {},
  methods: {
    back() {
      // #ifdef H5
      console.log(this.routerParams.share)
      if (this.routerParams.share) {
        const url = process.env.NODE_ENV === 'production' ? 'm.tomorni.com' : 'mtest.tomorni.com'
        window.location.href = `http://${this.value.domainPrefix}.${url}`
      } else {
        uni.navigateBack()
      }
      // #endif
      // #ifdef APP
      uni.navigateBack()
      // #endif
    },
    async shares() {
      // #ifdef H5
      const urlH5 = process.env.NODE_ENV === 'production' ? 'http://m.tomorni.com/hybrid/html/jump.html' : 'http://mtest.tomorni.com/hybrid/html/jump.html'
      
      const title = encodeURIComponent(this.value.goodsName)
      const desc = encodeURIComponent(Base64.decode(this.value.goodsDesc).replace(/<[^<>]+>/g, '').replace(/&nbsp;/gi, '').substr(0, 20))
      const href = `${window.location.href}&share=true&userId=${this.value.userId}&country=`
      const imgUrl = encodeURIComponent(this.value.goodsPictureList[0].pictureUrl)

      location.href = `${urlH5}?title=${title}&desc=${desc}&link=${encodeURIComponent(href)}&imgUrl=${imgUrl}` 
      // #endif

      // #ifdef APP
      const url =
        process.env.NODE_ENV === 'production'
          ? `http://${this.value.domainPrefix}.m.tomorni.com/pages/productDetails/index?id=${this.value.id}`
          : `http://${this.value.domainPrefix}.mtest.tomorni.com/pages/productDetails/index?id=${this.value.id}`
      const doc = Base64.decode(this.value.goodsDesc)
        .replace(/<[^<>]+>/g, '')
        .replace(/&nbsp;/gi, '')
      const img = this.value.goodsPictureList[0].pictureUrl

      const regExp = new RegExp('(\/[a-zA-Z0-9\/]+\.(jpg|png|jpeg))')

      const res = await getWechatShareImageAction({
        picPath: (img.match(regExp)[0] || '').slice(1),
        style: 'image/resize,m_fixed,w_100,h_100'
      })


      if (res.code === 200) {
        uni.share({
          provider: 'weixin',
          scene: 'WXSceneSession',
          type: 0,
          href: `${url}&share=true&userId=${this.value.userId}&country=`,
          title: this.value.goodsName,
          summary: doc,
          imageUrl: res.data,
          success: function (res) {
            console.log('success:' + JSON.stringify(res))
          },
          fail: function (err) {
            uni.showToast({
              icon: 'none',
              title: '分享失败',
              duration: 1500
            })
          }
        })
      } else {
        return uni.showToast({
          title: res.message,
          icon: 'none'
        })
      }

      
      // #endif
    }
  }
}
</script>

<style lang="scss" scoped>
.goods_navbar_com {
  position: fixed;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9;
  .status_bar {
    height: var(--status-bar-height);
    width: 100%;
    background-color: #000;
    opacity: 0.4;
  }
  .navbar {
    width: 100%;
    height: 110rpx;
    padding: 0 20rpx;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    .back {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .body {
      flex: 1;
    }
    .more {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .icon {
      width: 70rpx;
      height: 70rpx;
      border-radius: 50%;
      background-color: rgba(0, 0, 0, 0.4);
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }
  .poster_warp {
    width: 700rpx;
  }
}
</style>
